<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>校园图书共享平台</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.3/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/css/style.css" rel="stylesheet">
</head>
<body>
    <nav class="navbar navbar-expand-lg navbar-dark bg-primary">
        <div class="container">
            <a class="navbar-brand" href="${pageContext.request.contextPath}/">
                <i class="fas fa-book"></i> 校园图书共享平台
            </a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav me-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="${pageContext.request.contextPath}/books">图书列表</a>
                    </li>
                    <sec:authorize access="hasRole('USER')">
                        <li class="nav-item">
                            <a class="nav-link" href="${pageContext.request.contextPath}/books/my">我的图书</a>
                        </li>
                    </sec:authorize>
                    <sec:authorize access="hasRole('ADMIN')">
                        <li class="nav-item">
                            <a class="nav-link" href="${pageContext.request.contextPath}/admin">后台管理</a>
                        </li>
                    </sec:authorize>
                </ul>
                <ul class="navbar-nav">
                    <sec:authorize access="isAnonymous()">
                        <li class="nav-item">
                            <a class="nav-link" href="${pageContext.request.contextPath}/login">登录</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="${pageContext.request.contextPath}/users/register">注册</a>
                        </li>
                    </sec:authorize>
                    <sec:authorize access="isAuthenticated()">
                        <li class="nav-item dropdown">
                            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown">
                                <sec:authentication property="principal.username"/>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a class="dropdown-item" href="${pageContext.request.contextPath}/users/profile">个人中心</a></li>
                                <li><hr class="dropdown-divider"></li>
                                <li>
                                    <form action="${pageContext.request.contextPath}/logout" method="post" class="d-inline">
                                        <button type="submit" class="dropdown-item">退出登录</button>
                                    </form>
                                </li>
                            </ul>
                        </li>
                    </sec:authorize>
                </ul>
            </div>
        </div>
    </nav>

    <div class="container mt-4">
        <div class="row">
            <div class="col-md-8">
                <div class="jumbotron bg-light p-5 rounded">
                    <h1 class="display-4">欢迎来到校园图书共享平台</h1>
                    <p class="lead">在这里，你可以分享和借阅图书，让知识流动起来。</p>
                    <hr class="my-4">
                    <p>加入我们，成为知识的传播者！</p>
                    <sec:authorize access="isAnonymous()">
                        <a class="btn btn-primary btn-lg" href="${pageContext.request.contextPath}/users/register" role="button">
                            <i class="fas fa-user-plus"></i> 立即注册
                        </a>
                    </sec:authorize>
                </div>
            </div>
            <div class="col-md-4">
                <div class="card">
                    <div class="card-header">
                        <h5>平台统计</h5>
                    </div>
                    <div class="card-body">
                        <p><i class="fas fa-book"></i> 图书总数: <span class="badge bg-primary">1,234</span></p>
                        <p><i class="fas fa-users"></i> 用户总数: <span class="badge bg-success">567</span></p>
                        <p><i class="fas fa-exchange-alt"></i> 借阅次数: <span class="badge bg-warning">890</span></p>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mt-5">
            <div class="col-12">
                <h2>热门图书</h2>
                <div class="row">
                    <c:forEach items="${books}" var="book" begin="0" end="3">
                        <div class="col-md-3 mb-4">
                            <div class="card">
                                <img src="${book.coverImage}" class="card-img-top" alt="${book.title}" 
                                     onerror="this.src='https://via.placeholder.com/150x200?text=No+Image'">
                                <div class="card-body">
                                    <h5 class="card-title">${book.title}</h5>
                                    <p class="card-text">作者: ${book.author}</p>
                                    <p class="card-text">
                                        <span class="badge bg-info">${book.categoryName}</span>
                                        <span class="badge ${book.status == 'AVAILABLE' ? 'bg-success' : 'bg-danger'}">
                                            ${book.status == 'AVAILABLE' ? '可借阅' : '已借出'}
                                        </span>
                                    </p>
                                    <a href="${pageContext.request.contextPath}/books/${book.id}" class="btn btn-primary btn-sm">
                                        <i class="fas fa-info-circle"></i> 详情
                                    </a>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                </div>
                <div class="text-center">
                    <a href="${pageContext.request.contextPath}/books" class="btn btn-outline-primary">
                        查看更多图书 <i class="fas fa-arrow-right"></i>
                    </a>
                </div>
            </div>
        </div>
    </div>

    <footer class="bg-dark text-light mt-5 py-4">
        <div class="container text-center">
            <p>&copy; 2024 校园图书共享平台. 保留所有权利.</p>
        </div>
    </footer>

    <script src="https://cdn.bootcdn.net/ajax/libs/bootstrap/5.3.3/js/bootstrap.bundle.min.js"></script>
</body>
</html>
